editApply.vue<template>

  <div>

      <div>
        <BreakSpace label="选择车辆"  />
        <FormPanel
            ref="infoMain"
            :list="formList"
            :formType="'add'"
            :isSubmitBtn="false"
            :cols= "2"
        />
        <BreakSpace label="申请信息"  />
        <FormPanel
            ref="infoMain1"
            :list="formList2"
            :formType="'add'"
            :isSubmitBtn="false"
            :cols= "3"
        />
          <!--附件信息-->
        <FormPanel :list="followUpFormList3" :cols="3" :isSubmitBtn="false" :collapse="false" />
        <FilterTable
          ref="tableUp3"
          :columns="columnsUp3"
          :dataSource="tableListUp"
          :isMemoryPagination="true"
          :isSelectColumn="false"
          height="auto"
          :onColumnsChange="(columns) => (this.columns = columns)"
        >
        </FilterTable>


        <BreakSpace label="回复信息"  />

        <FormPanel
          ref="tableUp2"
          :list="columnsUp2"
          :formType="'add'"
          :isSubmitBtn="false"
          :cols= "3"
        />

      </div>


    <div
      :style="{
    position: 'absolute',
    left: 0,
    bottom: 0,
    right: 0,
    zIndex: 9,
    borderTop: '1px solid #e9e9e9',
    padding: '10px 20px',
    background: '#fff',
    textAlign: 'right',
   }"
    >
      <multiuse-button @click="closeDialogTop">关 闭</multiuse-button>
    </div>

  </div>
</template>
<script>
import { dictionary } from '@/utils/dictMixin';

import config from '@/assets/js/config';
import { getDetails } from '@/api/plateNumber/car/index.js';
import { findFileByUrl } from '@/api/partsmanage/financialManagement/capitalAccount/index'
export default {
  props: {
    type: {
      type: String,
      require: true,
    },
    rowData: {
      //Object,就是重父页面取得值放在这里面了
      type: Object,
    },
  },
  mixins: [dictionary],
  components: {  },
  data() {
    return {
      followUpFormList2: [
        {
          type: 'BREAK_SPACE',
          label: '回复信息',
        },
      ],
      followUpFormList3: [
        {
          type: 'BREAK_SPACE',
          label: '附件',
        },
      ],
      columnsUp2: this.createdTableUp2(),
      columnsUp3: this.createdTableUp3(),
      dataList1: [],
      visible: false,
      visibleDrawer: false,
      collapse: false,
      visibleAdd: false,
      vinSelect:false,
      infoId: null,
      saveData: null,
      flterValue: {}, //参数
      res: {}, //返回值
      fetchParams: {}, //ipa 接口
      selectedRows: [], //选中经销商
      formList: this.createFormList1(),
      formList2: this.createFormList2(),
      options: [],
      value: [],
      list: [],
      loading: false,
      states: [],
      data:{}
    };
  },

  mounted () {
    this.init()
  },

  methods: {
//初始化页面数据
    async init() {
      //调接口,查村所有数据
      const res = await getDetails({applyId: this.rowData.applyId});
      let data = {};
      if (res.resultCode === 200) {
        data = res.data;
        this.datailData = res.data;
      }
      //赋值给展示得字段
      this.formList.map(async (x) => {

        x.initialValue = data[x.fieldName];
      });
      //赋值给展示得字段
      this.formList2.map(async (x) => {

        x.initialValue = data[x.fieldName];
      });
      // //赋值给回复信息
      // this.columnsUp2.map(async (x) => {
      //
      //   x.initialValue = data[x.fieldName];
      // });

      //把查出来的数据直接交给系统遍历展示到附件表格
      console.log(" 999999999999999",res.data.file)
      if(res.data.file != null){
        this.$refs.tableUp3.EXECUTE_INSERT(res.data.file)
      }

      // 把查出来的数据直接交给系统遍历展示表格
      console.log(" 88888888888888888888",res.data.reply)
      if(res.data.reply != null){
        this.columnsUp2.forEach((x) => {
          console.log('this.columnsUp2.forEach',x,x.initialValue,res.data.reply[0][x.fieldName]);
          x.initialValue = res.data.reply[0][x.fieldName].toString();
        });
        // this.$refs.tableUp2.EXECUTE_INSERT(res.data.reply)  x.initialValue = data[x.res.data.reply];
      };
    },

    orderChange(val){
      this.data = JSON.parse(val)
      console.log('data',this.data);

    },


    //取消操作
    closeDialogTop(type) {
      // if (this.type !== 'show'){
      //   this.$confirm('确认关闭窗口吗', '提示', {
      //     confirmButtonText: '确定',
      //     cancelButtonText: '取消',
      //     type: 'warning'
      //   })
      //       .then(() => {
      //         this.closeDialog('closeDialog');
      //       })
      // }else {
        this.closeDialog('closeDialog');
      // }
    },
    //取消操作
    closeDialog(type) {
      this.$emit('close', { visible: false,type:type});
    },
    //控制回复说明是否必填
    changeRadio(props){
      console.log("8955555565661551",props)
      if (props == 1){
        this.initForm.find(item => item.fieldName==='remark').rules[0].required = false;
      }else {
        this.initForm.find(item => item.fieldName === 'remark').rules[0].required = false;
      }
    },
    createFormList1() {

      return [
        {
          type: 'INPUT',
          label: 'VIN',
          filterable: true,
          fieldName: 'vin',
          readonly: true, // 只读
          disabled: false, //置灰
          placeholder: '请输入VIN...',


        },
        {
          type: 'INPUT',
          label: '行驶里程',
          fieldName: 'mileage',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '发动机号',
          filterable: true,
          fieldName: 'engineNo',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '电机编码号',
          filterable: true,
          fieldName: 'motorNo',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '电池编号',
          filterable: true,
          fieldName: 'batteryNo',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '变速器号',
          filterable: true,
          fieldName: 'gearboxNo',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '车系',
          filterable: true,
          fieldName: 'series',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '车型',
          filterable: true,
          fieldName: 'modelName',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },


        {
          type: 'INPUT',
          label: '生产日期',
          filterable: true,
          fieldName: 'productDate',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },

        {
          type: 'INPUT',
          label: '车主姓名',
          filterable: true,
          fieldName: 'ownerName',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '车主电话',
          filterable: true,
          fieldName: 'ownerPhone',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },

        {
          type: 'INPUT',
          label: '车牌号',
          filterable: true,
          fieldName: 'license', //LICENSE
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },

      ];
    },

    createdTableUp3() {
      let isDetailed = this.type == 'detailed'?true:false;
      return [
        //附件信息
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            console.log('2121212121',props)
            return <span>{props.row.index + 1}</span>;
          }
        },

        {
          title: '附件',
          dataIndex: 'title',//FACTORY_AUDIT_BY
          editRequired: !isDetailed,
          render: p => {
            return (
              <div>
                <el-button size="mini" type="text" onClick={() => this.downloadFile(p.row.fileUrl)}>
                  {p.row.title}
                </el-button>
              </div>
            );
          }
        },
        {
          title: '上传时间',
          dataIndex: 'createdAt',//FACTORY_RAUDIT_TIME
          sorter: true,
          dateFormat: 'yyyy-MM-dd HH:mm:ss',
        },
      ];
    },


    createdTableUp2() {
      //回复信息
      return [

        {
          type: 'RADIO',
          label: '审核结果',
          fieldName: 'result',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue: '',
          selfCols: 3 ,
          itemList: [
            { text: '审核通过', value: '23531006' },
            { text: '审核驳回', value: '23531007' }
          ],
          change: props=>{
            this.changeRadio(props);
            console.log("9999999999999999999999999999999",props)
          }
        },

        {
          type: 'INPUT',
          label: '防盗码',
          filterable: true,
          fieldName: 'antitheftCode',
          readonly: true, // 只读
          // disabled: true, //置灰
          initialValue:'',
          unitRender: p => {
            console.log('p',p);
            return (
              <div>
                <multiuse-button  onClick={() => this.copyBtn(this.columnsUp2.find(x =>x.fieldName ==='antitheftCode').initialValue)} > 复制 </multiuse-button>
              </div>
            );
          }

        },

        {
          type: 'TEXT_AREA',
          label: '回复说明',
          maxlength: 200,
          fieldName: 'remark',
          placeholder: '请输入申请理由....',
          style: {width: '750px'},
          selfCols: 3 ,
          rows: 6,
          readonly: true, // 只读
          disabled: true, //置灰
          rules:[{required:true,massage:"请输入申请理由....",trigger:"blur"}]

        },



      ];
    },



    createFormList2() {
      return [

        {
          type: 'INPUT',
          label: '申请经销商',
          filterable: true,
          fieldName: 'dealerName',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '申请人',
          filterable: true,
          fieldName: 'applyBy',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },
        {
          type: 'INPUT',
          label: '申请时间',
          filterable: true,
          fieldName: 'applyAt',
          readonly: true, // 只读
          disabled: true, //置灰
          initialValue:'',
        },

        {
          type: 'TEXT_AREA',
          label: '申请说明',
          maxlength: 200,
          fieldName: 'remark',
          placeholder: '请输入申请理由....',
          style: {width: '750px'},
          selfCols: 3 ,
          rows: 6,
          readonly: true, // 只读
          disabled: true, //置灰
          rules:[{required:true,massage:"请输入申请理由....",trigger:"blur"}]
        },



      ];

    },
    // vin选择
    selectVin() {
      this.vinSelect = true;
    },


    // 附近执行下载动作
    async downloadFile(url) {
      console.log(url)
      const data = await this.downLoadByUrl(url);
      console.log('downloadUrl=====', data)
      let a = document.createElement('a');
      a.href = data;
      a.target = '_blank';
      a.click();
      a = null;
    },
    async downLoadByUrl(url, params = {}) {
      url = encodeURIComponent(url);
      let res = await findFileByUrl(url);
      console.log(res.data)
      return res.data;
    },

    delVideo(val) {
      this.$refs.fileTable.$refs.pageTable.EXECUTE_DELETE([val]);
      this.delFile.push(val.fileId);
    },
    delVideo2(val) {
      console.log('#@!#!', val);
      console.log('this,datalist', this.dataList);
      if(this.dataList.length<=1){
        this.$notify.error({ title: '提示信息', message: '至少要有一个回运清单！' });
      }else{
        this.$refs.table1.$refs.pageTable.EXECUTE_DELETE([val]);
        this.dtlID = this.dtlID.filter(i=>i!=val.dtlIds);
        this.rcpIdList.push(val.rcpId);
        console.log('this.rcpIdList',this.rcpIdList);
      }
    },
  //复制
    copyBtn(value){

      let copyInput = document.createElement("input"); //添加元素
      copyInput.value = value; //复制的值
      document.body.appendChild(copyInput); // 添加元素
      copyInput.select();
      document.execCommand("Copy"); // 执行浏览器复制命令
      document.body.removeChild(copyInput); // 移除刚创建的元素
      this.$notify.success({title: '提示信息', message: '复制成功'});
    },

  }
};
</script>
<style lang="less" scoped></style>
